<!-- @format -->

<template>
 <view class="task-card-main uno-rounded-[4px] uno-bg-white" @click.stop>
  <view class="uno-text-[14px] uno-p-x-[16px] task-card-main-list">
   <xlj-task-cell v-for="(item, index) of list" :un-check="unChange" :un-edit="unoEdit(item)" :key="index" :source="item" @change="notifyUpdateSubTask($event, index, 'change')" @update="notifyUpdateSubTask($event, index, 'update')"></xlj-task-cell>
  </view>
 </view>
</template>

<script setup>
 import { ref, computed } from 'vue';
 import dayjs from 'dayjs';
 const Props = defineProps({
  list: {
   type: Array,
   default: () => [],
  },
  source: {
   type: Object,
   default: () => ({}),
  },
 });
 const unChange = computed(() => {
  return Props.source.taskRepeat != 1 || Props.source.startTime > dayjs().startOf('day').add(1, 'days').subtract(1, 'milliseconds').valueOf();
 });
 function unoEdit(item) {
  return unChange.value && item.status > 1;
 }
 const Emit = defineEmits(['update', 'change']);
 function notifyUpdateSubTask(params, index, type) {
  Props.list[index] = params;
  Emit(type, Props.list);
 }
 //
</script>

<style lang="scss" scoped>
 .task-card-main {
  .task-card-main-list view:last-child {
   //  border-top-width: 0;
  }
 }
 .action {
  height: 100%;
 }
 .button {
  display: inline-block;
  padding: 0 11px;
  height: 100%;
  color: white;
  line-height: 42px;
 }
</style>
